{extend name="../../admin/view/main"}

{block name='content'}
<form action="{:request()->url()}" autocomplete="off" class="layui-form layui-card" data-auto="true" method="post">
    <div class="layui-card-body padding-40">

        <label class="layui-form-item relative block">
            <span class="color-green font-w7">车型标题</span>
            <span class="color-desc margin-left-5">Notify Title</span>
            <input class="layui-input" name="name" placeholder="请输入车型标题" required value='{$vo.name|default=""}'>
        </label>

        <label class="layui-form-item relative block" style="margin-top: 30px">
            <span class="color-green font-w7">匹配词</span>
            <span class="color-desc margin-left-5">Math Text</span>
            <div class="input-container">
                {if isset($vo.match_text_array)}
                {foreach $vo.match_text_array ?? [] as $key => $match_text_item}
                <div class="input-item">
                    <input class="layui-input" name="match_text[]" placeholder="匹配词" required value="{$match_text_item}">
                    <button type="button" class="delete-input-btn layui-btn layui-btn-primary">-</button>
                </div>
                {/foreach}
                {else}
                <div class="input-item">
                    <input class="layui-input" name="match_text[]" placeholder="匹配词" required value="">
                    <button type="button" class="delete-input-btn layui-btn layui-btn-primary">-</button>
                </div>
                {/if}
                <div type="button" class="add-input-btn layui-btn layui-btn-primary">+</div>
            </div>
        </label>

        <!--{if session('user.username') eq 'LiuLiang'}-->
        <label class="layui-form-item margin-bottom-20 block relative" style="margin-top: 10px">
            <span class="color-green font-s14 font-w7 margin-right-10">平台整车结算费用（元）</span>
            <input type="number" class="layui-input" name="platform_price" placeholder="请输入平台结算费用" required value="{$vo.platform_price|default='0.00'}">
        </label>

        <label class="layui-form-item margin-bottom-20 block relative" style="margin-top: 10px">
            <span class="color-green font-s14 font-w7 margin-right-10">平台双面结算费用（元）</span>
            <input type="number" class="layui-input" name="platform_double_price" placeholder="请输入平台结算费用" required value="{$vo.platform_double_price|default='0.00'}">
        </label>
        <!--{/if}-->

        <label class="layui-form-item margin-bottom-20 block relative" style="margin-top: 10px">
            <span class="color-green font-s14 font-w7 margin-right-10">师傅整车结算费用（元）</span>
            <input type="number" class="layui-input" name="painter_price" placeholder="请输入师傅结算费用" required value="{$vo.painter_price|default='0.00'}">
        </label>

        <label class="layui-form-item margin-bottom-20 block relative" style="margin-top: 10px">
            <span class="color-green font-s14 font-w7 margin-right-10">师傅双面结算费用（元）</span>
            <input type="number" class="layui-input" name="painter_double_price" placeholder="请输入师傅结算费用" required value="{$vo.painter_double_price|default='0.00'}">
        </label>

<!--        <label class="layui-form-item relative block">-->
<!--            <span class="color-green font-w7">排序 (倒序)</span>-->
<!--            <span class="color-desc margin-left-5">Read</span>-->
<!--            <input class="layui-input" type="number" name="sort" placeholder="排序" required value='{$vo.sort|default=0}'>-->
<!--        </label>-->

        <div class="hr-line-dashed"></div>
        {notempty name='vo.id'}<input name='id' type='hidden' value='{$vo.id}'>{/notempty}

        <div class="layui-form-item text-center">
            <button class="layui-btn" type="submit">保存数据</button>
            <button class="layui-btn layui-btn-danger" data-confirm="确定要取消编辑吗？" data-close type='button'>取消编辑</button>
        </div>
    </div>

</form>

<script>
    $(function() {
        var inputContainer = $('.input-container');

        // 绑定删除按钮的点击事件处理程序
        inputContainer.on('click', '.delete-input-btn', function() {
            // 删除对应的输入框
            $(this).parent('.input-item').remove();

            // 检查输入框数量和状态，并更新删除按钮的状态
            updateDeleteButtonStatus();
        });

        // 绑定添加按钮的点击事件处理程序
        $('.add-input-btn').click(function() {
            // 创建一个新的输入框
            var inputItem = $('<div class="input-item"><input class="layui-input" name="match_text[]" placeholder="匹配词" required value=""><button type="button" class="delete-input-btn layui-btn layui-btn-primary">-</button></div>');

            // 将新的输入框添加到输入框容器中
            inputContainer.append(inputItem);

            // 检查输入框数量和状态，并更新删除按钮的状态
            updateDeleteButtonStatus();
        });

        // 在页面加载时检查删除按钮的状态
        updateDeleteButtonStatus();

        function updateDeleteButtonStatus() {
            var inputItems = inputContainer.find('.input-item');
            var deleteButtons = inputItems.find('.delete-input-btn');

            if (inputItems.length === 1 && inputItems.find('input').val() === '') {
                // 如果只有一个输入框且为空，则禁用删除按钮
                deleteButtons.prop('disabled', true);
            } else {
                // 否则启用删除按钮
                deleteButtons.prop('disabled', false);
            }
        }
    });
</script>

<style>
    .add-input-btn {
        position: absolute;
        top: -38px;
        right: 0;
        width: 40px; /* 调整按钮宽度 */
        height: 36px; /* 调整按钮高度 */
        font-size: 14px; /* 调整按钮字号 */
        line-height: 36px; /* 调整按钮行高 */
        padding: 0; /* 去除按钮内边距 */
        z-index: 9999;
    }

    .input-item {
        position: relative;
    }

    .delete-input-btn {
        position: absolute;
        top: 0;
        right: 0;
        z-index: 9999;
    }

    .input-container {
        position: relative;
    }
</style>
{/block}